<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>


<jsp:include page="head.jsp"></jsp:include>
<!DOCTYPE html>
<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>漫步时尚广场</title>
<c:set var="contextpath" value="${pageContext.request.contextPath }" scope="application"/>
<script>
    var contextpath="${contextpath}";
</script>
<link href="${pageContext.request.contextPath }/css/style.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    .focusBox {
        position: absolute;
        top: 490px;
        width: 120px;
        left: 50%;
        margin-left: -60px;
        list-style: none;
    }
    
    .focusBox li {
        float: left;
        margin-right: 10px;
        width: 15px;
        height: 15px;
        border-radius: 10px;
        background: gray;
        cursor: pointer;
    }
    
    .focusBox li.cur {
        background: #f60;
        opacity: 0.6;
        filter: alpha(opacity=60);
    }
    </style>
    <script type="text/javascript" src="${pageContext.request.contextPath }/js/pictureSlide.js" ></script>
</head>
<body>
<!--logo和banner start-->
<table width="1200" border="0" cellspacing="0" cellpadding="0" align="center">
  <tr>
    <td height="95"><a href="index"><img src="${pageContext.request.contextPath }/images/logo.jpg"></a></td>
    <td align="right"><img src="${pageContext.request.contextPath }/images/banner.jpg"></td>
  </tr>
</table>
<!--logo和banner  end--> 
<!--菜单导航 start-->
<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#ce2626" >
  <tr>
    <td><table width="1200" border="0" cellspacing="0" cellpadding="4" align="center" class="nav_font16">
        <tr>
          <td width="200">&nbsp;</td>
          <td width="80" align="center" class="nav_active"><a href="${pageContext.request.contextPath }/index" class="white">首页</a></td>
          <td width="100" align="center"><font style="color: white;">最新上架</font></td>
          <td width="100" align="center">品牌活动</td>
          <td width="100" align="center">原厂直供</td>
          <td width="80" align="center">团购</td>
          <td width="100" align="center">限时抢购</td>
          <td width="100" align="center">促销打折</td>
          <td width="200" align="center">&nbsp;</td>
        </tr>
      </table></td>
  </tr>
</table>
<!--菜单导航 end--> 
<!--中间部分 start-->
<table width="1200" border="0" align="center" cellpadding="0" cellspacing="0" class="padding-top">
  <tr>
    <td width="220" valign="top" ><!--购物分类 start-->
      
      <table width="100%" border="0" cellspacing="1" cellpadding="0"  class="table1" bgcolor="#e5e4e1">
        <c:forEach items="${goodsType}" var="goodt">
            <tr>
              <th><a href="${pageContext.request.contextPath }/shoppingShow?goodTypeId=${goodt.id}">${goodt.typename}</a></th>
            </tr>
            <c:forEach items="${goodt.subType}" var="st">
                <tr>
                  <%-- <th><a href="${pageContext.request.contextPath }/shoppingShow?goodTypeId=${st.id}">${st.typename}</a></th> --%>
                  <td><span class="red_dot"></span>
                    <a href="${pageContext.request.contextPath }/shoppingShow?goodTypeId=${st.id}">${st.typename}</a>
                    <img src="${pageContext.request.contextPath }/images/arrow_r.jpg" align="right">
                  </td>
                </tr>
            </c:forEach>
        </c:forEach>
      </table>
      
    <!--购物分类end--></td>
    <td width="716" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td align="center">
          <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td align="center" valign="top">
                  <!--焦点图 start--> 
                  <img src="${pageContext.request.contextPath }/images/index/pic1.jpg" width="690" height="350" id="focusImg"> 
                   <ul class="focusBox">
                      <li onclick="showPic(1);"></li>
                      <li onclick="showPic(2);"></li>
                      <li onclick="showPic(3);"></li>
                   </ul>
                  <!--焦点图 end-->
                  </td>
                 
                <td valign="top">
                <!--右侧start-->
                  
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td>
                      <!--公告 start-->
                        
                        <table width="100%" border="0" cellspacing="1" cellpadding="0" bgcolor="#eeeeee">
                          <tr>
                            <td height="35" bgcolor="#f7f7f7" class="notice_title">公告</td>
                          </tr>
                          <tr>
                            <td bgcolor="#ffffff"><table width="95%" border="0" align="center" cellpadding="0" cellspacing="0" class="padding-top">
                                
                              <c:forEach items="${noticelist}" var="nt">
                                    <%-- <li><a href="javascript:openNotice('${pageContext.request.contextPath }/selectANotice?id=${nt.id }');">${nt.ntitle }</a></li> --%>
                                    <tr><td height="30" class="notice_text"><a href="#"><span class="gray_dot"></span>${nt.ntitle }</a></td></tr>
                              </c:forEach>
                              </table></td>
                          </tr>
                        </table>
                        
                        <!--公告 end--></td>
                    </tr>
                    <tr>
                      <td height="8"></td>
                    </tr>
                    <tr>
                      <td><!--品牌推荐区 start-->
                        
                        <table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#f7f7f7">
                          <tr>
                            <td align="center"><img src="${pageContext.request.contextPath }/images/index/link1.gif" width="80" height="35"></td>
                            <td align="center"><img src="${pageContext.request.contextPath }/images/index/link2.gif" width="80" height="35"></td>
                            <td align="center"><img src="${pageContext.request.contextPath }/images/index/link3.gif" width="80" height="35"></td>
                          </tr>
                          <tr>
                            <td align="center"><img src="${pageContext.request.contextPath }/images/index/link4.gif" width="80" height="35"></td>
                            <td align="center"><img src="${pageContext.request.contextPath }/images/index/link7.jpg" width="90" height="45" /></td>
                            <td align="center"><img src="${pageContext.request.contextPath }/images/index/link6.jpg" width="90" height="45"></td>
                          </tr>
                          <tr>
                            <td align="center"><img src="${pageContext.request.contextPath }/images/index/link5.jpg" width="90" height="45" /></td>
                            <td align="center"><img src="${pageContext.request.contextPath }/images/index/link8.jpg" width="90" height="45"></td>
                            <td align="center"><img src="${pageContext.request.contextPath }/images/index/link9.jpg" width="90" height="45"></td>
                          </tr>
                        </table>
                        
                        <!--品牌推荐区 end--></td>
                    </tr>
                  </table>
                  
                  <!-- 右侧end--></td>
              </tr>
            </table></td>
        </tr>
        <!--产品分类区start-->
        <tr>
          <td><table width="99%" border="0" align="right" cellpadding="0" cellspacing="1" bgcolor="#dddddd">
              <tr>
                <td width="20%" bgcolor="#ffffff"><table width="90%" border="0" align="center" cellpadding="3" cellspacing="0">
                    <tr>
                      <td><img src="${pageContext.request.contextPath }/images/index/pro1.jpg" width="65" height="65"></td>
                      <td class="font14">热门品类<br/>
                        护肤彩妆启示</td>
                    </tr>
                    <tr>
                      <td colspan="2">洗护套装&nbsp;&nbsp;&nbsp;&nbsp;面部精华&nbsp;&nbsp;&nbsp;&nbsp;香水</td>
                    </tr>
                    <tr>
                      <td colspan="2">粉底液&nbsp;&nbsp;&nbsp;&nbsp;面霜&nbsp;&nbsp;&nbsp;&nbsp;洁面</td>
                    </tr>
                    <tr>
                      <td colspan="2">美容工具&nbsp;&nbsp;&nbsp;&nbsp;复方精油&nbsp;&nbsp;&nbsp;&nbsp;洗发水 </td>
                    </tr>
                  </table></td>
                <td width="20%" bgcolor="#ffffff"><table width="90%" border="0" align="center" cellpadding="3" cellspacing="0">
                    <tr>
                      <td><img src="${pageContext.request.contextPath }/images/index/pro2.jpg" width="65" height="65"></td>
                      <td class="font14">强效保养<br/>
                        逆转皮肤问题</td>
                    </tr>
                    <tr>
                      <td colspan="2">隔离&nbsp;&nbsp;&nbsp;&nbsp;保湿&nbsp;&nbsp;&nbsp;&nbsp;补水&nbsp;&nbsp;&nbsp;&nbsp;清洁</td>
                    </tr>
                    <tr>
                      <td colspan="2">清爽&nbsp;&nbsp;&nbsp;&nbsp;排毒&nbsp;&nbsp;&nbsp;&nbsp;去角质</td>
                    </tr>
                    <tr>
                      <td colspan="2">美白&nbsp;&nbsp;&nbsp;&nbsp;袪痘&nbsp;&nbsp;&nbsp;&nbsp;收缩毛孔&nbsp;&nbsp;&nbsp;&nbsp;紧质</td>
                    </tr>
                  </table></td>
                <td width="20%" bgcolor="#ffffff"><table width="90%" border="0" align="center" cellpadding="3" cellspacing="0">
                    <tr>
                      <td><img src="${pageContext.request.contextPath }/images/index/pro3.jpg" width="65" height="65"></td>
                      <td class="font14"> 人气品牌<br/>
                        最IN大牌</td>
                    </tr>
                    <tr>
                      <td colspan="2"></td>
                    </tr>
                    <tr>
                      <td colspan="2">薇姿&nbsp;&nbsp;&nbsp;&nbsp;
                        欧莱雅&nbsp;&nbsp;&nbsp;&nbsp;
                        美宝莲&nbsp;&nbsp;&nbsp;&nbsp;</td>
                    </tr>
                    <tr>
                      <td colspan="2">SK-II&nbsp;&nbsp;&nbsp;&nbsp;
                        百雀羚&nbsp;&nbsp;&nbsp;&nbsp;
                        雅顿&nbsp;&nbsp;&nbsp;&nbsp;</td>
                    </tr>
                    <tr>
                      <td colspan="2">美即&nbsp;&nbsp;&nbsp;&nbsp;
                        谜尚&nbsp;&nbsp;&nbsp;&nbsp;
                        妮维雅 </td>
                    </tr>
                  </table></td>
                <td width="20%" bgcolor="#ffffff"><table width="90%" border="0" align="center" cellpadding="3" cellspacing="0">
                    <tr>
                      <td><img src="${pageContext.request.contextPath }/images/index/pro4.jpg" width="65" height="65"></td>
                      <td class="font14">潮流单品<br/>
                        当季最红</td>
                    </tr>
                    <tr>
                      <td colspan="2">奶浴奶膏&nbsp;&nbsp;&nbsp;&nbsp;补水凝胶&nbsp;&nbsp;&nbsp;&nbsp;</td>
                    </tr>
                    <tr>
                      <td colspan="2">防装生发液&nbsp;&nbsp;&nbsp;&nbsp;假发片&nbsp;&nbsp;&nbsp;&nbsp;香水</td>
                    </tr>
                    <tr>
                      <td colspan="2">艾米尔彩妆&nbsp;&nbsp;&nbsp;&nbsp;丰胸美乳霜</td>
                    </tr>
                  </table></td>
                <td width="20%" bgcolor="#ffffff"><table width="90%" border="0" align="center" cellpadding="3" cellspacing="0">
                    <tr>
                      <td><img src="${pageContext.request.contextPath }/images/index/pro5.jpg" width="65" height="65"></td>
                      <td class="font14">美装精选<br/>
                        超赞专题</td>
                    </tr>
                    <tr>
                      <td colspan="2">孕妇护肤&nbsp;&nbsp;&nbsp;&nbsp;护季保养</td>
                    </tr>
                    <tr>
                      <td colspan="2">护肤嫩白集锦&nbsp;&nbsp;&nbsp;&nbsp;快速约会妆</td>
                    </tr>
                    <tr>
                      <td colspan="2">美容时钟模式&nbsp;&nbsp;&nbsp;&nbsp;5步护肤术</td>
                    </tr>
                  </table></td>
              </tr>
            </table></td>
        </tr>
        <!-- 产品分类区end-->
      </table></td>
  </tr>
</table>
<!--中间部分 end--> 
<!--底部 start--><Br/>
<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#6a6665" height="35" class="foot_bg">
  <tr>
    <td class="padding-top"><table width="1200" border="0" align="center" cellpadding="0" cellspacing="0">
        <tr>
          <td width="20%" align="center"><img src="${pageContext.request.contextPath }/images/gray1.jpg" ></td>
          <td width="20%" align="center"><img src="${pageContext.request.contextPath }/images/gray2.jpg" ></td>
          <td width="20%" align="center"><img src="${pageContext.request.contextPath }/images/gray3.jpg" ></td>
          <td width="20%" align="center"><img src="${pageContext.request.contextPath }/images/gray4.jpg" ></td>
          <td width="20%" align="center"><img src="${pageContext.request.contextPath }/images/gray5.jpg" ></td>
        </tr>
      </table></td>
  </tr>
  <tr>
    <td bgcolor="#efefef" class="foot_line padding-top"><table width="1200" border="0" cellspacing="0" cellpadding="0" align="center">
        <tr>
          <td align="center" valign="top"><img src="${pageContext.request.contextPath }/images/red1.jpg"><br>
            <img src="${pageContext.request.contextPath }/images/line1.jpg"/></td>
          <td width="15%" valign="top"><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
              <tr>
                <td class="font16 padding-bottom">新手指导</td>
              </tr>
              <tr>
                <td>用户注册</td>
              </tr>
              <tr>
                <td>电话下单</td>
              </tr>
              <tr>
                <td>购物流程</td>
              </tr>
              <tr>
                <td>购物保障</td>
              </tr>
              <tr>
                <td>服务协议</td>
              </tr>
            </table></td>
          <td align="center" valign="top"><img src="${pageContext.request.contextPath }/images/red2.jpg"><br>
            <img src="${pageContext.request.contextPath }/images/line1.jpg"/></td>
          <td width="15%" valign="top"><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
              <tr>
                <td class="font16 padding-bottom">支付方式</td>
              </tr>
              <tr>
                <td>货到付款</td>
              </tr>
              <tr>
                <td>商城卡支付</td>
              </tr>
              <tr>
                <td>支付宝、网银支付</td>
              </tr>
              <tr>
                <td>优惠券抵用</td>
              </tr>
            </table>
          <td align="center" valign="top"><img src="${pageContext.request.contextPath }/images/red3.jpg"><br>
            <img src="${pageContext.request.contextPath }/images/line1.jpg"/></td>
          <td width="15%" valign="top"><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
              <tr>
                <td class="font16 padding-bottom">配送方式</td>
              </tr>
              <tr>
                <td>闪电发货</td>
              </tr>
              <tr>
                <td>满百包邮</td>
              </tr>
              <tr>
                <td>配送范围及时间</td>
              </tr>
              <tr>
                <td>商品验收及签收</td>
              </tr>
              <tr>
                <td>服务协议</td>
              </tr>
            </table></td>
          <td align="center" valign="top"><img src="${pageContext.request.contextPath }/images/red4.jpg"><br>
            <img src="${pageContext.request.contextPath }/images/line1.jpg"/></td>
          <td width="15%" valign="top"><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
              <tr>
                <td class="font16 padding-bottom">售后服务</td>
              </tr>
              <tr>
                <td>退换货协议</td>
              </tr>
              <tr>
                <td>关于发票</td>
              </tr>
              <tr>
                <td>退换货流程</td>
              </tr>
              <tr>
                <td>退换货运费</td>
              </tr>
            </table></td>
          <td align="center" valign="top"><img src="${pageContext.request.contextPath }/images/red5.jpg"><br>
            <img src="${pageContext.request.contextPath }/images/line1.jpg"/></td>
          <td width="15%" valign="top"><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
              <tr>
                <td class="font16 padding-bottom">关于帐号</td>
              </tr>
              <tr>
                <td>修改个人信息</td>
              </tr>
              <tr>
                <td>修改密码</td>
              </tr>
              <tr>
                <td>找回密码</td>
              </tr>
            </table></td>
          <td align="center" valign="top"><img src="${pageContext.request.contextPath }/images/red6.jpg"><br>
            <img src="${pageContext.request.contextPath }/images/line1.jpg"/></td>
          <td width="15%" valign="top"><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
              <tr>
                <td class="font16 padding-bottom">优惠活动</td>
              </tr>
              <tr>
                <td>竞拍须知</td>
              </tr>
              <tr>
                <td>抢购须知</td>
              </tr>
            </table></td>
        </tr>
      </table></td>
  </tr>
  <tr>
    <td bgcolor="#efefef" align="center" class="padding-top">Copyright  2015-2020  Q- Walking Fashion E&S 漫步时尚广场（QST教育）版权所有<Br/>
      中国青岛 高新区河东路8888号  青软教育集团    咨询热线：400-658-0166  400-658-1022<br/>
      <img src="${pageContext.request.contextPath }/images/foot_pic.jpg"></td>
  </tr>
</table>
<!--底部 end-->
</body>
</html>